<template>
	<view class="" v-if="!this.userInfo">
		<view class="pic-container">
			<image src="/static/icons/dzlogo.png" class="unlogin"></image>
		</view>

		<view class="cms-name">
			文化予商业赋能
		</view>
		<view class="wechat-login">
			使用微信账号快捷登录
		</view>


		<button class="get-info"   @click="getInfo" v-if="!hasRight">
			一键获取用户信息
		</button>

		<button class="get-phone" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" v-else>
			一键获取手机号
		</button>

	</view>
</template>

<script>
	import WXBizDataCrypt from "@/utils/WXBizDataCrypt.js"
	import {
		mapMutations,
		mapState
	} from 'vuex'
	export default {
		name: "my-login",
		// props:{
		// 	redirect:{
		// 		type:String,
		// 		default:''
		// 	}
		// },
		data() {
			return {
				openId: '',
				session_key: '',
				redirect: '',
				appid: 'wx0de53dd26541f75e',
				user: {},
				hasRight:false
			};
		},
		onLoad(option) {
			// console.log(uni.getStorageSync('openId'),uni.getStorageSync('session_key'))
			// this.user = JSON.parse(uni.getStorageSync('user'))
			// this.openid = option.openId
			// this.session_key = option.session_key
			this.redirect = uni.getStorageSync('redirect')
		},
		onShow() {
			// 获取推荐人手机号
			// uni.showModal({
			// 	title:uni.getStorageSync('recPhone')
			// })
		},
		methods: {
			...mapMutations('m_user', ['updateUserInfo', 'updateRedirectInfo']),
			
			// 获取opeind
			async getOpenId(code){
				const {data:res}=await uni.$http.post('/user/getModelByCode',{
					code:code
				})
				console.log(res)
				if(res.success==0){
					this.openId=res.data.openid
					uni.setStorageSync('openId',res.data.openid)
					this.session_key=res.data.session_key
				}
			},
			// 
			async getInfo(){
				var that = this
				uni.login({
					provider: 'weixin',
					success: res => {
						console.log(res,4)
						var that = this
						that.getOpenId(res.code)
						uni.setStorageSync('setcode',res.code)
					},
					fail:res=> {
						console.log(res)
					}
					
				})
				
				// desc 为必填字段，用于声明获取用户个人信息后的用途，不超过30个字符
				const [err, res] = await uni.getUserProfile({
					desc: '获取用户信息'
				}).catch(err => err)
				if (err !== null && err.errMsg === "getUserProfile:fail auth deny") return uni.$showMsg('您取消了微信授权！')
				console.log(res,'sex')
				that.user = res.userInfo
				this.hasRight=true
				
				
			},
			async getPhoneNumber(e) {
				let pc = new WXBizDataCrypt(this.appid, this.session_key);
				let data = pc.decryptData(e.detail.encryptedData,
					e.detail.iv);
				uni.setStorageSync('phone', data.phoneNumber)
				//data就是最终解密的用户信息 
				// let phone = data.phoneNumber
				// console.log(data)
				// 登录后重定向
				var that = this
				uni.$http.post('/user/getUserData', {
					openid: that.openId,
					phone: data.phoneNumber,
					nickname: that.user.nickName,
					headImg: that.user.avatarUrl,
					recPhone: uni.getStorageSync('recPhone')
				}).then(res => {
					console.log(res.data.data)
					if (res.data.msg == "成功") {
						// uni.$showMsg('登录成功!')
						that.updateUserInfo(res.data.data)
						uni.navigateBack({
							delta: 0
						})



						// 登录后重定向
						if (that.redirect == '/pages/my/my') {
							console.log('my')
							// uni.switchTab({
							// 	url: '/pages/my/my'
							// })
							uni.navigateBack({
								delta: 0
							})
						} else {
							console.log(that.redirect)
							// uni.navigateTo({
							// 	url: that.redirect
							// })
							// uni.reLaunch({
							// 	url:that.redirect
							// })
							uni.redirectTo({
								url: that.redirect
							})
						}
					}
				})
			},

			// 调用登录成功后返回上一页
			navigateBack() {
				if (this.redirectInfo && this.redirectInfo.openType === 'switchTab') {
					// 调用 uni.switchTab 方法返回到购物车界面
					uni.switchTab({
						url: this.redirectInfo.from,
						complete: () => {
							this.updateRedirectInfo({})
						}
					})
				}
			}

		},
		computed: {
			...mapState('m_user', ['redirectInfo'])
		}
	}
</script>

<style lang="scss">
	.get-phone {
		width: 702rpx;
		height: 78rpx;
		background: #D80E0E;
		border-radius: 8rpx;
		font-size: 28rpx;
		font-weight: bold;
		color: #FFFFFF;
	}
	.get-info{
		width: 702rpx;
		height: 78rpx;
		background: #02c35e;
		border-radius: 8rpx;
		font-size: 28rpx;
		font-weight: bold;
		color: #FFFFFF;
	}

	.pic-container {
		width: 100%;
		display: flex;
		justify-content: center;
	}

	.unlogin {
		width: 480rpx;
		height: 485rpx;
		margin-top: 140rpx;
	}

	.cms-name {
		font-size: 42rpx;
		font-weight: bold;
		color: #111111;
		height: 100rpx;
		line-height: 100rpx;
		margin-top: 100rpx;
		// margin-bottom: 30rpx;
		text-align: center;
	}

	.wechat-login {
		font-size: 30rpx;
		font-weight: 500;
		color: #999999;
		height: 120rpx;
		line-height: 120rpx;
		text-align: center;
		// margin-bottom: 47rpx;
	}
</style>
